import React, { useState } from 'react';
import { Radio } from 'antd-mobile';
import './index.less';

export default function SelfRadio(props) {
  const { radioData, handleRadioChange } = props;
  const [radioValue, setRadioValue] = useState('');
  function handleChange(e) {
    setRadioValue(e);
    handleRadioChange(e);
  }
  return (
    <div className="selfRadio">
      {radioData.length > 0 &&
        radioData.map((item, index) => {
          return (
            <Radio
              className="radio-item"
              key={index}
              checked={radioValue === item.value}
              onChange={() => handleChange(item.value)}
            >
              {item.name}
            </Radio>
          );
        })}
    </div>
  );
}
